<template>
   <div style="height:93vh;background-color: #f6f6f6;left:0;right:0;z-index:9999;overflow: scroll;"
       class="po_fi">
    <div class="top fx-1 fx-items-center fx-between">
      <div>
        景区资讯
      </div>
      <img src="../../assets/icon/cha.png"
           @click="$emit('close')">
    </div>
    <div class="list fx-column">
      <div class="unit fx-column m-t-10" v-for="(item,index) in list" :key="index" @click="$router.push({ path: '/informationDetails', query: { id: item.id }})">
        <div class="fx-items-center title">
          <div class="size-16 display-txt">
            {{item.title}}
          </div>
          <div class="size-12 m-l-30 time">
            {{item.release_time}}
          </div>
        </div>
        <div class="line" />
        <div class="size-12  content">
          <div class="display-txt-two text">
              {{item.content}}
          </div>
        </div>

      </div>
      <van-empty v-if="list.length === 0" description="暂无资讯" />
    </div>
  </div>
</template>

<script>
export default {
	name: 'information',
	components: {},
	props: {
		list: {
			type: Array,
			default: [],
		},
	},
	data() {
		return {
		};
	},
	mounted() {
	},
	methods: {},
};
</script>

<style lang="scss" scoped>
.top {
	padding: 14px;
	font-size: 14px;
	color: #101010;
	img {
		width: 10px;
		height: 10px;
	}
}
.list {
	padding: 0px 14px;
	.unit {
		background: #ffffff;
		border-radius: 6px;
		.title {
			padding: 12px 20px;
			color: #333333;
			.time {
				white-space: nowrap;
				color: #292929;
			}
		}
		.line {
			margin: 0 8px;
			border: 1px solid rgba(0, 0, 0, 0.03);
		}
		.content {
			padding: 12px 20px 10px 20px;
			.text {
				color: #a8a8a8;
			}
		}
	}
}
</style>